<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="文件名称">
              <a-input placeholder="请输入文件名称" v-model="queryParam.docName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="三甲条款">
              <a-input placeholder="请输入三甲条款" v-model="queryParam.jic"></a-input>
            </a-form-item>
          </a-col>
          <template v-if="toggleSearchStatus">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="文档状态">
                <j-dict-select-tag placeholder="请选择文档状态" v-model="queryParam.docStatus" dictCode="doc_status"/>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="是否过期">
                <j-dict-select-tag placeholder="请选择是否过期" v-model="queryParam.docExpired" dictCode="doc_expired"/>
              </a-form-item>
            </a-col>
          </template>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <template>
      <a-row :gutter="10">
        <a-col :md="4" :sm="24">
          <a-card :bordered="false">
            <div style="background: #fff;padding-left:1px;height: 100%; margin-top: 5px" class="no-left">
              <!-- 树-->
              <template v-if="userIdentity === '2' && categoryTree.length>0">
                <!--组织机构-->
                <a-tree
                  showLine
                  :checkStrictly="true"
                  :treeData="categoryTree"
                  :autoExpandParent="autoExpandParent"
                  @select="onSelect"
                />
              </template>
              <template v-else-if="userIdentity === '2' && categoryTree.length==0">
                <a-empty/>
              </template>
            </div>
          </a-card>
        </a-col>
        <a-col :md="20" :sm="24">
          <a-card :bordered="false">
            <div class="table-operator">
              <a-button @click="handleInfo(selectedObj)" type="primary">新建</a-button>
              <!--              <a-button type="primary" @click="handleInfo(3)">查看</a-button>-->
              <a-dropdown v-if="selectedRowKeys.length > 0">
                <a-menu slot="overlay">
                  <a-menu-item key="1" @click="batchDel">
                    <a-icon type="delete"/>
                    删除
                  </a-menu-item>
                </a-menu>
                <a-button style="margin-left: 8px"> 批量操作
                  <a-icon type="down"/>
                </a-button>
              </a-dropdown>
            </div>

            <!-- table区域-begin -->
            <div>
              <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
                <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
                selectedRowKeys.length }}</a>项
                <a style="margin-left: 24px" @click="onClearSelected">清空</a>
              </div>

                <a-table
                  ref="table"
                  size="middle"
                  bordered
                  rowKey="id"
                  :columns="columns"
                  :dataSource="dataSource"
                  :pagination=ipagination
                  :loading="loading"
                  :rowSelection="{fixed:true,selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
                  @change="handleTableChange">

                <template slot="htmlSlot" slot-scope="text">
                  <div v-html="text"></div>
                </template>
                <template slot="imgSlot" slot-scope="text">
                  <span v-if="!text" style="font-size: 12px;font-style: italic;">无此图片</span>
                  <img v-else :src="getImgView(text)" height="25px" alt="图片不存在"
                       style="max-width:80px;font-size: 12px;font-style: italic;"/>
                </template>
                <template slot="fileSlot" slot-scope="text">
                  <span v-if="!text" style="font-size: 12px;font-style: italic;">无此文件</span>
                  <a-button
                    v-else
                    :ghost="true"
                    type="primary"
                    icon="download"
                    size="small"
                    @click="uploadFile(text)">
                    下载
                  </a-button>
                </template>

                <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical"/>
                  <!--          <a @click="handleCheckInfo(record)">查看</a>-->
          <a @click="handleYuLan(record)">预览</a>
          <a-divider type="vertical"/>
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
            <a-menu slot="overlay">
              <a-menu-item>
                <a @click="handleRecord(record)">操作记录</a>
                </a-menu-item>
              <a-menu-item>
                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item>
                <a v-if="record.docStatus==1">
                  <a @click="handleOpen(record)">启用</a>
                </a>
                <a v-if="record.docStatus==0">
                  <a @click="handleClose(record)">禁用</a>
                </a>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
          </span>
              </a-table>
            </div>
          </a-card>
        </a-col>
      </a-row>
    </template>

    <editor-edit-modal ref="modalForm" @ok="this.sx"/>
    <RecordModal ref="recordForm"/>
    <EditorModal ref="editForm" @ok="this.sx"/>
    <EditorInfoModal ref="editInfoForm"/>
  </a-card>
</template>

<script>

  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
  import EditorEditModal from './modules/EditorEditModal'
  import EditorInfoModal from './modules/EditorInfoModal'
  import RecordModal from './modules/RecordModal'
  import EditorModal from './modules/EditorModal'
  import JDictSelectTag from '@/components/dict/JDictSelectTag.vue'
  import {queryCategoryTreeList} from '@/api/api'
  import {getAction} from '@/api/manage'
  import {deleteAction, postAction} from "../../api/manage";

  export default {
    name: 'DocManager',
    mixins: [JeecgListMixin],
    components: {
      JDictSelectTag,
      RecordModal,
      EditorModal,
      EditorInfoModal,
      EditorEditModal,
    },
    data() {
      return {
        selectedObj: {},
        editor: [],
        id: '',
        record: [],
        selectedKeys: [],
        dataSource: [],
        visible: false,
        hiding: true,
        disableSubmit: false,
        iExpandedKeys: [],
        loading: false,
        autoExpandParent: true,
        disable: true,
        treeData: [],
        categoryTree: [],
        userIdentity: '',
        description: '文档管理页面',
        currSelected: {},
        event: '',

        // 表头
        columns: [
          {
            title: '#',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            /*fixed: 'left',*/
            align: 'center',
            customRender: function (t, r, index) {
              return parseInt(index) + 1
            }
          },
          {
            title: '文件分类',
            align: 'center',
            dataIndex: 'categoryName'
          },
          {
            title: '文件名称',
            align: 'center',
            dataIndex: 'docName'
          },
          {
            title: '文件编号',
            align: 'center',
            dataIndex: 'docNo'
          },
          {
            title: '定制科室',
            align: 'center',
            dataIndex: 'dzDepartment'
          },
          // {
          //   title: '文件大小',
          //   align: 'center',
          //   width: 100,
          //   dataIndex: 'docSize'
          // },
          {
            title: '三甲条款',
            align: 'center',
            dataIndex: 'jic'
          },
          {
            title: '生效日期',
            align: 'center',
            dataIndex: 'sxTime',
            customRender: function (text) {
              return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
            }
          },
          // {
          //   title: '到期日期',
          //   align: 'center',
          //   width: 100,
          //   dataIndex: 'dqTime',
          //   customRender: function (text) {
          //     return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
          //   }
          // },
          // {
          //   title: '是否三甲条款',
          //   align: 'center',
          //   dataIndex: 'isJic_dictText'
          // },
          // {
          //   title: '能否下载',
          //   align: 'center',
          //   width: 100,
          //   dataIndex: 'download_dictText'
          // },
          // {
          //   title: '能否打印',
          //   align: 'center',
          //   width: 100,
          //   dataIndex: 'print_dictText'
          // },
          {
            title: '审核人',
            align: 'center',
            dataIndex: 'audit'
          },
          // {
          //   title: '富文本',
          //   width: 100,
          //   align: "center",
          //   dataIndex: 'editorString'
          // },
          {
            title: '文档状态',
            align: 'center',
            dataIndex: 'docStatus_dictText'
          },
          // {
          //   title: '是否过期',
          //   width: 100,
          //   align: 'center',
          //   dataIndex: 'docExpired_dictText'
          // },
          {
            title: '操作',
            dataIndex: 'action',
            align: 'center',
            scopedSlots: {customRender: 'action'}
          }
        ],
        url: {
          list: '/doc/doc/list',
          open: '/doc/doc/open',
          close: '/doc/doc/close',
          delete: '/doc/doc/delete',
          deleteBatch: '/doc/doc/deleteBatch',
          exportXlsUrl: '/doc/doc/exportXls',
          importExcelUrl: 'doc/doc/importExcel',
        },
        dictOptions: {},
      }
    },
    computed: {
      importExcelUrl: function () {
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
      },
    },
    methods: {
      handlePageChange(pageNumber) {
        console.log(pageNumber)
        getAction(this.url.list, formData, 'get').then((res) => {
          if (res.result.records != null && res.result.records != 'null' && res.result.records.length > 0) {
            for (let i = 0; i < res.result.records.length; i++) {
              let data = res.result.records[i]
              if (data.docCategory == this.id) {
                this.dataSource.push(data)
              }
            }
          }
        })
      },
      handleDelete: function (id) {
        if (!this.url.delete) {
          this.$message.error("请设置url.delete属性!")
          return
        }
        var that = this;
        getAction(that.url.delete, {id: id}).then((res) => {
          if (res.success) {
            that.$message.success(res.message);
            that.onSelect(this.selectedKeys,this.event);
          } else {
            that.$message.warning(res.message);
          }
        });
      },
      handleEdit(record){
        this.$refs.modalForm.edit(record);
        this.$refs.modalForm.title = "编辑";
      },
      handleYuLan(record){
        var param={
          docName:record.docName,
          id:record.id
        }
        getAction(this.url.YuLan, param).then((res) => {
        })
        window.open(window._CONFIG['domianURL']+"/doc/doc/toPdfFile?docName="+record.docName+"&id="+record.id);
      },
      handleOpen: function (record) {
        postAction(this.url.open, record, 'get').then((res) => {
          this.$nextTick(() => {
            if (res.success) {
              if (this.selectedKeys == null || this.selectedKeys == '') {
                this.loadData()
              } else {
                this.loadTable()
              }
              this.$message.warning('启用成功！')
              return false
            }
          })
        })
      },
      handleClose: function (record) {
        postAction(this.url.close, record, 'get').then((res) => {
          this.$nextTick(() => {
            if (res.success) {
              if (this.selectedKeys == null || this.selectedKeys == '') {
                this.loadData()
              } else {
                this.loadTable()
              }
              this.$message.warning('禁用成功！')
              return false
            }
          })
        })
      },
      // handleCheckInfo: function (record) {
      //   this.$refs.editInfoForm.edit(record.id)
      //   this.$refs.editInfoForm.title = '查看'
      // },
      handleInfo: function (operation) {
        if (this.selectedObj.value == undefined && this.selectedObj.label == undefined) {
          this.$message.warning('请选择新增目录')
        } else {
          // this.$refs.editForm.open(2)
          this.$refs.editForm.edit(operation)
          this.$refs.editForm.title = '新建空白word'
        }

        // if (this.selectedRowKeys.length > 1) {
        //   this.$message.warning('只能查看一行')
        //   return;
        // }
        // //从模板创建Word
        // if (operation == 1) {
        //   this.$refs.editForm.open(operation)
        //   this.$refs.editForm.title = '从模板创建Word'
        // }
        // //新建空白word
        // else if (operation == 2) {
        //   this.$refs.editForm.open(operation)
        //   this.$refs.editForm.title = '新建空白word'
        // } else {
        //   let key = this.selectedRowKeys
        //   if (key == null || key == '') {
        //     this.$message.warning('请先选中一条记录!')
        //     return false
        //   }
        //   this.$refs.editInfoForm.edit(key)
        //   this.$refs.editInfoForm.title = '查看'
        // }
      },
      handleRecord: function (record) {
        this.$refs.recordForm.edit(record)
        this.$refs.recordForm.title = '操作记录'
        this.$refs.recordForm.disableSubmit = false
        let id = record.id
        this.$refs.recordForm.open(id)
      },
      initDictConfig() {
      },
      callback(key) {
        console.log(key)
      },
      loadData() {
        this.refresh();
      },
      sx() {
        this.onSelect(this.selectedKeys,this.event)
      },
      loadTree() {
        var that = this
        that.treeData = []
        that.categoryTree = []
        queryCategoryTreeList().then((res) => {
          if (res.success && res.result) {
            let temp
            for (let i = 0; i < res.result.length; i++) {
              temp = res.result[i]
              that.categoryTree.push(temp)
              that.setThisExpandedKeys(temp)
            }
            this.loading = false
          }
          that.userIdentity = res.message
        })
      },
      setThisExpandedKeys(node) {
        if (node.children && node.children.length > 0) {
          this.iExpandedKeys.push(node.key)
          for (let a = 0; a < node.children.length; a++) {
            this.setThisExpandedKeys(node.children[a])
          }
        }
      },
      refresh() {
        this.loading = true
        this.loadTree()
      },
      onSelect(selectedKeys, e) { //
        this.event = e
        this.selectedObj = {}
        this.dataSource = []
        if (this.selectedKeys[0] !== selectedKeys[0]) {
          this.selectedKeys = [selectedKeys[0]]
        }
        let record = e.node.dataRef
        this.selectedObj = {label: record.name, value: record.id}
        var formData = {
          docCategory: record.id,
          // 添加请求参数pageNo、pageSize，不添加默认为pageNo=1，pageSize=10
        }
        this.id = record.id
        getAction(this.url.list, formData, 'get').then((res) => {
          if (res.result.records != null && res.result.records != 'null' && res.result.records.length > 0) {
            for (let i = 0; i < res.result.records.length; i++) {
              let data = res.result.records[i]
              if (data.docCategory == this.id) {
                this.dataSource.push(data)
              }
            }
          }
        })
      },
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>